<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="css/material.css">
    <script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>

    <title></title>

    <script type="text/javascript">
        $(function(){
	        $.ajax({
                url:"/api/v1/material/type",
                type:"GET",
                data:{},
                crossDomain: true, // 跨域，即不同域名、端口号可以访问
                contentType: 'application/json; charset=utf-8',  // 请求体数据格式 json字符串
                success:function(d){
                    //alert("ok")
                    if(d['status']==500){
                        alert(d['data']);
                    }
                    if(d['status']==200){
                        show(d['data']);
                    }
                },
			    error:function(){},
			    dataType:"json"
		    });

            $("#save").click(function(){

                window.open ("material_saveType.html",
                    "newwindow", "height=400px, width=400, top=200px, left=500px, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no")&nbsp;

            });

            $("#back").click(function(){


            });

        });

        function show(data){
		    $.each(data,function (i,j){
				//每个用户的按钮id必须区分开
				$("#materialType").append("<tr><td>"+j['typeName']+"</td>"+"<td>"+j['typeId']+"</td>"+"<td>"+j['remark']+"</td>"+
						"<td><button id='update"+i+"' type='button'>修改</button>"
						+"<button id='delete"+i+"' type='button'>删除</button></td></tr>");
				
				
				
				$("#update"+i).click(function(){
                    var typeName = encodeURI(encodeURI(j['typeName']));
                    var remark = encodeURI(encodeURI(j['remark']));
                    window.open ("material_updateType.html?typeName="+typeName+"&&typeId="+j['typeId']+"&&remark="+remark,
								"newwindow", "height=400px, width=400, top=200px, left=500px, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no")&nbsp; 
					
				});
				
				$("#delete"+i).click(function(){
					$.ajax({
                    url:"/api/v1/material/type/"+j['typeId'],
                    type:"DELETE",
                    data:{},
                    success:function(d){
                        //alert("ok")
                        if(d['status']==500){
                            alert(d['data']);
                        }
                        if(d['status']==200){
                            alert("删除成功");
                            show(d['data']);
                        }
                    },
                    error:function(){},
                    dataType:"json"
		            });
				});

				
			});
	    }
        


    </script>

</head>
<body>
    <div>
        <div class="functionLabel">
           器材模块-->查看所有器材租借信息<br><br>
           <input type="button" value="返回" id="back">&emsp;&emsp;&emsp;&emsp;<input type="button" value="增加类型" id="save"><br><br>
        </div>
        <div class="listAllMaterial">
        
            <form action=""  >
        
                <table class="listAllMaterialTable">

                    <thead>
                        <tr>
                            <td>类型名称</td>
                            <td>类型编号</td>
                            <td>备注</td>
                            <td>操作</td>

                        </tr>
                    </thead>
                   
                    <tbody id="materialType">

                    </tbody>
    

                </table>
        
            </form>
        </div>
    </div>
    
</body>
</html>